<template>
	<view class="an-map">
		<!-- 打卡地图 -->
		<map style="width: 750rpx; height: 100%;"
		 subkey="FKXBZ-MVL3J-MY7FZ-F4IJQ-BD7W7-RSBDO"
			ref="signMap"
			id="signMap"
			:latitude="latitude" 
			:longitude="longitude" 
			:markers="markers"
			:include-points="mappoint">
		</map>
		
	</view>
</template>

<script>
	const util = require('@/common/util.js');
	export default {
		data() {
			return {
				latitude: 39.909,
				longitude: 116.39742,
				markers: [],//标记点用于在地图上显示标记的位置
				mappoint: [],  //定位坐标
				list:[],
				podData:{
					page: 1,
					pageSize: 50	// 请求数据条数
				}
			}
		},
		onLoad(){
			this.mapCtx = uni.createMapContext('signMap')
			this.getList()
		},
		methods: {
			getList(){
				uni.showLoading({
				    title: '加载中'
				})
				this.$api.selectAllUsersign(this.podData).then(res=>{
					uni.hideLoading()
					this.list = res.list
					this.showMap()
				})
			},
			async showMap(){	// 地图上面显示定位点
				let newdata = this.list;
				let newmapdata = this.markers;
				let newmappoint = this.mappoint;
				let newPolyline = [];
				for(let i= 0;i<newdata.length; i++){
				  if (newdata[i].sign != null && newdata[i].sign != null){
					  let imgUrl = ''
					  try{
						  await util.getImg(newdata[i].avatarurl).then(val=>{ // 下载用户头像
						  		imgUrl = val
						  })
					  }catch(e){
						  console.log(e)
						  // 用户头像下载出错跳出循环
						  continue	
					  }
					  if(newdata[i].sign.longitude && newdata[i].sign.latitude){	// 排除未打卡的用户
						  newmapdata.push({
						  	id:newdata[i].id,
						  	iconPath: imgUrl,
						  	longitude: newdata[i].sign.longitude,
						  	latitude: newdata[i].sign.latitude,
						  	width:'30',
						  	height:'30',
						  });
						  newmappoint.push({
						  	longitude: newdata[i].sign.longitude,
						  	latitude: newdata[i].sign.latitude,
						  });
					  }
				  }
				}
			},
		}
	}
</script>

<style>

</style>
